<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
		<title>京东</title>
		<style>
			/*通用样式*/
			
			body,
			div,
			a,
			form,
			input,
			ul,
			p,
			span,
			strong,
			h2 {
				margin: 0;
				padding: 0;
			}
			
			@font-face {
				font-family: iconfont;
				src: url(//at.alicdn.com/t/font_403341_n8tj33yn5peng66r.eot 
);
				src: url(//at.alicdn.com/t/font_403341_n8tj33yn5peng66r.eot?#iefix 
) format('embedded-opentype'), url(//at.alicdn.com/t/font_403341_n8tj33yn5peng66r.woff 
) format('woff'), url(//at.alicdn.com/t/font_403341_n8tj33yn5peng66r.ttf 
) format('truetype'), url(//at.alicdn.com/t/font_403341_n8tj33yn5peng66r.svg#iconfont 
) format('svg');
			}
			.JDtop{
				z-index: 20;
			}
			
			.iconfont {
				font-family: iconfont;
				font-size: 12px;
				color: white;
				background: #f23030;
				border-radius: 6px;
			}
			
			a {
				text-decoration: none;
				display: inline-block;
			}
			
			.clearfix:after {
				display: table;
				content: "";
				clear: both;
			}
			
			.fl {
				float: left;
				width: 25%;
			}
			
			.fr {
				float: right;
			}
			
			body {
				background: #f6f6f6;
				overflow-x: hidden;
			}
			/*header样式*/
			
			.header {
				width: 100%;
				position: relative;
			}
			
			.banner {
				width: 100%;
			}
			
			.banner img {
				width: 100%;
			}
			
			.JDtop {
				width: 100%;
				height: 40px;
				position: fixed;
				top: 0;
				left: 0;
				background-image: linear-gradient(red, rgba(0, 0, 0, 0));
			}
			
			.imgnav {
				position: absolute;
				bottom: 10px;
				width: 100%;
				text-align: center;
			}
			
			.imgnav span {
				display: inline-block;
				width: 6px;
				height: 6px;
				border: 1px solid white;
				border-radius: 7px;
				margin-left: 5px;
			}
			
			.imgnav span.now {
				background: white;
			}
			
			.search {
				position: absolute;
				top: 0px;
				width: 85%;
			}
			
			.search form input {
				width: 100%;
				height: 27px;
				border: none;
				outline: none;
				border-radius: 15px;
				box-sizing: border-box;
				margin-top: 5px;
				margin-left: 10px;
				padding-left: 50px;
			}
			
			.img_JD {
				position: absolute;
				top: 8px;
				left: 18px;
			}
			
			.img_JD img {
				width: 18px;
				height: 12px;
			}
			
			.img_search {
				position: absolute;
				top: 8px;
				left: 40px;
			}
			
			.img_search img {
				width: 12px;
				height: 12px;
			}
			
			.link {
				position: absolute;
				top: 6px;
				right: 8px;
			}
			
			.link a {
				color: white;
				font-size: 14px;
			}
			/*body样式*/
			
			.body_nav {
				width: 100%;
				padding-top: 8px;
			}
			
			.body_nav a {
				width: 20%;
				text-align: center;
				float: left;
				margin: 6px 0;
				color: #666;
			}
			
			.body_nav a img {
				width: 29px;
				height: 29px;
			}
			
			.body_nav a p {
				font-size: 12px;
				color: #666;
			}
			
			.img_advertising {
				width: 100%;
				background: white;
				margin-top: 6px;
			}
			
			.img_advertising img {
				width: 100%;
			}
			
			.JDnews {
				width: 90%;
				height: 30px;
				margin-left: 5%;
				margin-bottom: 8px;
				background: white;
				position: relative;
				border-radius: 10px;
			}
			
			.JDnews img {
				width: 73px;
				height: 16px;
				position: absolute;
				top: 6px;
				left: 10px;
			}
			
			.JDnews a {
				font-size: 12px;
				color: #666;
			}
			
			.JDnews .text1 {
				position: absolute;
				top: 6px;
				left: 90px;
			}
			
			.red {
				color: red;
				margin-right: 8px;
			}
			
			.more {
				position: absolute;
				top: 6px;
				right: 10px;
				padding-left: 8px;
				border-left: 1px solid #ccc;
			}
			
			.JDMS {
				background: white;
			}
			
			.top_left,
			strong,
			.top_right {
				height: 34px;
				line-height: 34px;
			}
			
			.top_left img {
				width: 69px;
				height: 27px;
				vertical-align: middle;
			}
			
			.top_left strong {
				font-size: 12px;
				margin-left: 6px;
			}
			
			.smallbox {
				font-size: 12px;
				width: 19px;
				height: 17px;
				color: #232326;
				border: 1px solid #dfdfdf;
				margin: 0 2px;
			}
			
			.top_right {
				color: #f23030;
				font-size: 12px;
				margin-right: 10px;
			}
			
			.carousel_merchandise {
				width: 600px;
			}
			
			.merchandise {
				width: 108px;
				padding: 4px;
			}
			
			.merchandise img {
				width: 100%;
				height: auto;
				border-left: 1px solid #ccc;
			}
			
			.merchandise h2 {
				color: #f23030;
				font-size: 16PX;
				line-height: 16PX;
				height: 16PX;
				text-align: center;
				font-weight: bold;
			}
			
			.merchandise p {
				color: #686868;
				font-size: 12PX;
				line-height: 12PX;
				text-align: center;
				text-decoration: line-through;
			}
			
			.table {
				margin: 0 0 60px;
			}
			
			.table_box {
				width: 25%;
				height: auto;
				text-align: center;
			}
			
			.table_box {
				box-sizing: border-box;
				border: 1px solid #ccc;
				border-left: none;
				border-bottom: none;
			}
			
			.table_box p {
				color: #222222;
				font-size: .75rem;
			}
			
			.table_box div img {
				width: 100%;
			}
			/*footer样式*/
			
			.footer {
				background: white;
				width: 100%;
				height: 50px;
				position: fixed;
				bottom: 0;
				left: 0;
				padding-bottom: 4px;
			}
			
			.footer a {
				width: 20%;
				height: 50px;
			}
			
			.footer a img {
				width: 100%;
				height: auto;
			}
		</style>
	</head>

	<body>
		<div class="header">
			<div class="banner">
				<img src="https://img1.360buyimg.com/da/jfs/t12697/249/2037279585/87827/c284a11/5a30896bN07aee060.jpg" />
				<div class="imgnav">
					<span></span>
					<span class="now"></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
					<span></span>
				</div>
			</div>
			<div class="JDtop">
				<div class="search">
					<form>
						<input placeholder="360京东超级品牌日，领券最高减600" />
					</form>
					<div class="img_JD">
						<img src="

AAAA9rOU8AAAB7UlEQVRIicXXT4hNYRjH8c

+dblHUTVG6mtEkUSJ/J1MjG2ahiIWNtRILFigLK6WUkShSipWNFbEwKZqysDDy

JxYjlMY0RU0jU5e4Y/Gek3dOM+fWzL1zfnXq

+T3ved/zPe973nOeUxru7pGjo7ge

+R14lsTr8WaGfj/xAyMYwgs8xau8i5XzGuegxclRxVYcSvIfhJu7iYlsp7YWwc

yk1biM99iTbWzmzJzFoyQuYRlWYCN6E5BUHXiI07jUCpjPGMxp345z2J34Evow

hlvM7zI9F2boBCaj/DV0zjdMqqs4E/mFOF8UDGF5Xkb

+IJYXBVPHxciXsb8oGHiAX5HfWSTMhKlv8HVFwsDHKK4WDTMWxZWiYaaoaJglU

TxeNMyqKB5pBFNpIcgibIj8u0YwC1oIszcz/kAjmI6M/9YkkDahfEj1B/cawWy

L4ppQJjRDp7A58ncxmgdzQKhzUz3B7yaAHMeFyNeEwmzarV3GEdzJ5G/MEaIL/

bgiFFapjklmvCwsRQUrsUmYkWpmoPvChy1PndgS

+aVoF3ZML9Zkzq/jJG6nidJwd8+kfA1gn/DrESvvV6WRvuAwHsfJvGdmVHjQdk

0DMlsNCWXn2iwI/wvyGr7jE14LVX4//s7ignWMCyXC1wRgUNgAb/M6/gPrElp1

gukJzAAAAABJRU5ErkJggg==" />
					</div>
					<div class="img_search">
						<img src="

AAADgKtSgAAAB/0lEQVRIiaXVTUhVQRjG8d

+1Mm2TRWALoXLRh4i1yPbRIoNw0SJwGS1KKSqLCgJpU1BBughKaJ2LwEUGfe7a

FQR9aUEUVOSuDyIuWlKLM2PT6VzJex848M4z5/3PzHvOzJSGh4dV0DL0YAc6sB

LT

+IDXuIURfK4EWFjgNeAIjqMp11eP9eHZiTO4gEGU86C6XHs1HuFsAbhITWGAhy

G3IrwFD9CeeOPoR1tYUUOI

+0NfVHvIbSmCN2A06SyjT1brQUxgKjwTwevAQdl3iJMbRWMefhidIZ5GNy5jJr

/URDO4JKt9HKAzsGbhy3EySTqK

+3NA87onK1PUicBUJ/vdloaOF2HG89WVkCuweiJ8e/LSVXOXopJmQm5UV4RvSs

w7VYCjbifxxghvTsw3NcDT3OYIn0rMXzXA093+M8InE7O1BviqJJ6M8FeJ2VUD

fGsSP4nw9CPuxYIqwCX0Ju27ET6Cr8Fsx/4q4H3+nEnfcT3CP

+Fc8uJFbJsHeDPOJ+2hwJw9W4bwLMT1GMM

+/x7JqUqynTiGJcF7LjuCpfAyduFjaDfKtvRTHMI6LMJirJXV9zGuyW6oqBZZi

eqhlLvm1uCGv8/0ajSO7vyy32ILTuHLf0C

+Kd7VbRgoqmlZds214gBu4h1+yHbz+

+D1yq62DThWNJl8WWrRCpzGHrzE7t8cqmerthhqyQAAAABJRU5ErkJggg==" />
					</div>
				</div>
				<div class="link">
					<a href="#">登录</a>
				</div>
			</div>
		</div>

		<!--body部分-->
		<div class="body">
			<ul class="body_nav clearfix">
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5668/159/160398199/14046/acfe1fa3/591d9424N068a7ad0.png" />
					<p>京东超市</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t11425/73/2288282326/13451/e11c7697/5a14d167Ne5414496.png" />
					<p>全球购</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5656/351/153181074/12227/e35aa8d/591d9456Naa85e195.png" />
					<p>京东服饰</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5707/83/1407890143/14681/29321e2c/59263c71Nc7d16503.png" />
					<p>京东生鲜</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5773/256/159664156/17475/742fec7e/591d9475Na810c2eb.png" />
					<p>京东到家</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5647/156/156583179/12255/981e942a/591d94a1Nfde63a47.png" />
					<p>充值缴费</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/s126x126_jfs/t2758/175/4146829331/10078/d6a3aa98/57aacab9N98edf989.png" />
					<p>领京豆</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t14356/332/557242646/16568/856edbd/5a30d628N0edbf336.png" />
					<p>领券</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5824/248/156712927/7215/1ad6be5f/591d94c6Nc4711ad2.png" />
					<p>赚钱</p>
				</a>
				<a>
					<img src="https://m.360buyimg.com/mobilecms/jfs/t5842/205/151189300/13247/a6de2d/591d94edNc42fb94d.png" />
					<p>物流查询</p>
				</a>
			</ul>
			<a class="img_advertising" href="#">
				<img src="https://m.360buyimg.com/mobilecms/jfs/t13894/153/2133584467/165590/76c3cbe9/5a32073eN1fdd5d54.jpg!q70.jpg" />
			</a>
			<div class="JDnews">
				<img src="//st.360buyimg.com/m/images/index/jd-news-tit.png" />
				<a class="text1" href="#">
					<span class="red">热</span>听说潘玮柏上个月花了7W多买鞋
				</a>
				<a class="more">更多</a>
			</div>
			<div class="JDMS">
				<div class="carousel">
					<div class="carousel_top clearfix">
						<div class="top_left fl">
							<img src="//st.360buyimg.com/m/images/index/load/skill.png" />
							<strong>22点场</strong>
							<span class="smallbox">01</span>:<span class="smallbox">11</span>:<span class="smallbox">33</span>
						</div>
						<a class="top_right fr" href="#">京选尖货秒&nbsp;<span class="iconfont">&#xe62e;</span></a>
					</div>
					<ul class="carousel_merchandise">
						<a class="merchandise fl" href="#">
							<img src="https://m.360buyimg.com/mobilecms/s220x220_jfs/t13276/152/1796683873/190163/8197e723/5a2a0cdeN314c1700.jpg!q70.jpg" />
							<h2>￥999</h2>
							<p>￥1188</p>
						</a>
						<a class="merchandise fl" href="#">
							<img src="https://m.360buyimg.com/mobilecms/s220x220_jfs/t15226/310/134517193/151965/3a1b9725/5a24b858Nfcac7e08.jpg!q70.jpg" />
							<h2>￥159</h2>
							<p>￥529</p>
						</a>
						<a class="merchandise fl" href="#">
							<img src="https://m.360buyimg.com/mobilecms/s220x220_jfs/t5689/138/3057656522/301458/9b64a50c/59365f0dNbaf61088.jpg!q70.jpg" />
							<h2>￥138</h2>
							<p>￥258</p>
						</a>
						<a class="merchandise fl" href="#">
							<img src="https://m.360buyimg.com/mobilecms/s220x220_jfs/t12304/256/1735076731/197023/3e523d2b/5a27d981N419aa36d.jpg!q70.jpg" />
							<h2>￥32.9</h2>
							<p>￥99</p>
						</a>
					</ul>
				</div>
				<div class="table clearfix">
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#FF2A2A,#F139D2" style="background-image: -webkit-linear-gradient(left, rgb(255, 42, 42), rgb(241, 57, 210)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">白条商城</strong>
						<p>底价疯抢中~</p>
						<div><img src="https://m.360buyimg.com/mobilecms/s240x240_jfs/t14770/47/247529063/20502/8f891f6c/5a27afe9Nc66b0410.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#FE8537,#F02B2B" style="background-image: -webkit-linear-gradient(left, rgb(254, 133, 55), rgb(240, 43, 43)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">品牌秒杀</strong>
						<p>低价抢大牌</p>
						<div><img src="https://m.360buyimg.com/mobilecms/s240x240_jfs/t15358/337/559695488/19336/bf135682/5a30f0feNeafa42c5.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#D400FF,#FF310A" style="background-image: -webkit-linear-gradient(left, rgb(212, 0, 255), rgb(255, 49, 10)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">闪购</strong>
						<p>大牌限时特卖</p>
						<div><img src="https://m.360buyimg.com/n1/jfs/t12667/37/1357153136/285476/dd9a25b9/5a1f5d9fNc190d41a.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#FF2A00,#FF00AF" style="background-image: -webkit-linear-gradient(left, rgb(255, 42, 0), rgb(255, 0, 175)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">爱吃</strong>
						<p>领券199-120</p>
						<div><img src="https://m.360buyimg.com/mobilecms/s240x240_jfs/t16552/5/445050271/41836/766c1953/5a31d1edN1a9f0662.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#D400FF,#FF320A" style="background-image: -webkit-linear-gradient(left, rgb(212, 0, 255), rgb(255, 50, 10)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">排行榜</strong>
						<p>专属购物指南</p>
						<div><img src="https://m.360buyimg.com/n1/jfs/t3847/182/3070193850/48670/88a3a8db/58732d44Ne171be34.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#00C2AB,#3E94FF" style="background-image: -webkit-linear-gradient(left, rgb(0, 194, 171), rgb(62, 148, 255)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">发现好货</strong>
						<p>发现品质生活</p>
						<div><img src="https://m.360buyimg.com/n1/jfs/t9112/229/8451692/30312/a50cfb29/599eb912N44f34228.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#FF765C,#FF23B3" style="background-image: -webkit-linear-gradient(left, rgb(255, 118, 92), rgb(255, 35, 179)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">会买专辑</strong>
						<p>教你买买买</p>
						<div><img src="https://m.360buyimg.com/n1/jfs/t3847/363/1011221115/115066/b541f12c/58203c1cNf0f1453f.jpg!q70.jpg" /></div>
					</a>
					<a class="table_box fl">
						<strong class="graphic-tit" data-titcolor="#2AD396,#85BB1F" style="background-image: -webkit-linear-gradient(left, rgb(42, 211, 150), rgb(133, 187, 31)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;">新品首发</strong>
						<p>全面屏手机</p>
						<div><img src="https://m.360buyimg.com/mobilecms/s240x240_jfs/t14632/126/617665858/40903/7b49814c/5a32461fN484410e6.png!q70.jpg" /></div>
					</a>
				</div>
			</div>
		</div>

		<!--footer部分-->
		<ul class="footer clearfix">
			<a class="fl" href="#"><img src="//st.360buyimg.com/m/images/index/a-home.png" /></a>
			<a class="fl" href="#"><img src="//st.360buyimg.com/m/images/index/n-catergry.png" /></a>
			<a class="fl" href="#"><img src="//st.360buyimg.com/m/images/index/n-find.png" /></a>
			<a class="fl" href="#"><img src="//st.360buyimg.com/m/images/index/n-cart.png" /></a>
			<a class="fl" href="#"><img src="//st.360buyimg.com/m/images/index/n-me.png" /></a>
		</ul>
	</body>

</html>